@import './token.less';

@popconfirm-prefix-cls: ~'@{prefix}-popconfirm';

.@{popconfirm-prefix-cls} {
  &-content {
    padding: @popconfirm-padding-vertical @popconfirm-padding-horizontal;
    box-sizing: border-box;
  }

  &-title {
    position: relative;
    margin-bottom: @popconfirm-margin-title-bottom;
    font-size: @popconfirm-font-title-size;
    color: @popconfirm-color-title-text;
    display: flex;
    align-items: flex-start;

    &-icon {
      font-size: @popconfirm-size-title-icon;
      margin-right: @popconfirm-margin-icon-right;
      display: inline-flex;
      align-items: center;
      height: @line-height-base * @popconfirm-font-title-size;

      .@{prefix}-icon-exclamation-circle-fill {
        color: @color-warning-6;
      }
    }
  }

  &-has-content &-title {
    margin-bottom: 0;
    font-weight: @font-weight-500;
  }

  &-inner-content {
    margin-top: @popconfirm-margin-content-top;
    margin-bottom: @popconfirm-margin-content-bottom;
    padding-left: @popconfirm-size-title-icon + @popconfirm-margin-icon-right;
  }

  .@{popconfirm-prefix-cls}-btn {
    text-align: right;

    > button {
      margin-left: @popconfirm-margin-button-left;
    }
  }
}

.@{popconfirm-prefix-cls}-rtl {
  .@{popconfirm-prefix-cls} {
    &-title {
      &-icon {
        margin-left: @popconfirm-margin-icon-right;
        margin-right: 0;
      }
    }

    &-inner-content {
      padding-left: 0;
      padding-right: @popconfirm-size-title-icon + @popconfirm-margin-icon-right;
    }

    &-btn {
      text-align: left;

      > button {
        margin-right: @popconfirm-margin-button-left;
        margin-left: 0;
      }
    }
  }
}
